<template>
	<div>
		<el-form
			ref="ruleForm"
			:model="queryData"
			:rules="rules"
			:inline="true"
		>
			<h4 class="type-name">APP/H5</h4>
			<el-form-item
				v-if="languages.includes('zh_CN')"
				:label="
					`${$t('common.zh')}-${$t(
						'friendInvitation.app_enter_image'
					)}:`
				"
				:show-message="true"
				prop="enterPictureZh"
			>
				<UploadItem
					ref="enterPictureZh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.enterPictureZh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'enterPictureZh')
					"
					@deleteUpoladItem="handleDeleteUpload('enterPictureZh')"
					@upoladItemDefeat="handleUploadDefeat('enterPictureZh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('zh_CN')"
				:label="`${$t('operation.activity_list.app_main')}:`"
				:show-message="true"
				prop="masterPictureZh"
			>
				<UploadItem
					ref="masterPictureZh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.masterPictureZh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'masterPictureZh')
					"
					@deleteUpoladItem="handleDeleteUpload('masterPictureZh')"
					@upoladItemDefeat="handleUploadDefeat('masterPictureZh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('zh_CN')"
				:label="`${$t('operation.activity_list.app_share')}:`"
				:show-message="true"
				prop="sharePictureZh"
			>
				<UploadItem
					ref="sharePictureZh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.sharePictureZh"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'sharePictureZh')
					"
					@deleteUpoladItem="handleDeleteUpload('sharePictureZh')"
					@upoladItemDefeat="handleUploadDefeat('sharePictureZh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<br />
			<el-form-item
				v-if="languages.includes('en_US')"
				:label="
					`${$t('common.en')}-${$t(
						'friendInvitation.app_enter_image'
					)}:`
				"
				:show-message="true"
				prop="enterPictureEn"
			>
				<UploadItem
					ref="enterPictureEn"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.enterPictureEn"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'enterPictureEn')
					"
					@deleteUpoladItem="handleDeleteUpload('enterPictureEn')"
					@upoladItemDefeat="handleUploadDefeat('enterPictureEn')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('en_US')"
				:label="`${$t('operation.activity_list.app_main_english')}:`"
				:show-message="true"
				prop="masterPictureEn"
			>
				<UploadItem
					ref="masterPictureEn"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.masterPictureEn"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'masterPictureEn')
					"
					@deleteUpoladItem="handleDeleteUpload('masterPictureEn')"
					@upoladItemDefeat="handleUploadDefeat('masterPictureEn')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('en_US')"
				:label="`${$t('operation.activity_list.app_share_english')}:`"
				:show-message="true"
				prop="sharePictureEn"
			>
				<UploadItem
					ref="sharePictureEn"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.sharePictureEn"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'sharePictureEn')
					"
					@deleteUpoladItem="handleDeleteUpload('sharePictureEn')"
					@upoladItemDefeat="handleUploadDefeat('sharePictureEn')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<br />
			<el-form-item
				v-if="languages.includes('th_TH')"
				:label="
					`${$t('common.th')}-${$t(
						'friendInvitation.app_enter_image'
					)}:`
				"
				:show-message="true"
				prop="enterPictureTh"
			>
				<UploadItem
					ref="enterPictureTh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.enterPictureTh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'enterPictureTh')
					"
					@deleteUpoladItem="handleDeleteUpload('enterPictureTh')"
					@upoladItemDefeat="handleUploadDefeat('enterPictureTh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('th_TH')"
				:label="`${$t('operation.activity_list.app_main_thai')}:`"
				:show-message="true"
				prop="masterPictureTh"
			>
				<UploadItem
					ref="masterPictureTh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.masterPictureTh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'masterPictureTh')
					"
					@deleteUpoladItem="handleDeleteUpload('masterPictureTh')"
					@upoladItemDefeat="handleUploadDefeat('masterPictureTh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('th_TH')"
				:label="`${$t('operation.activity_list.app_share_thai')}:`"
				:show-message="true"
				prop="sharePictureTh"
			>
				<UploadItem
					ref="sharePictureTh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.sharePictureTh"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'sharePictureTh')
					"
					@deleteUpoladItem="handleDeleteUpload('sharePictureTh')"
					@upoladItemDefeat="handleUploadDefeat('sharePictureTh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<br />
			<el-form-item
				v-if="languages.includes('vi_VN')"
				:label="
					`${$t('common.vn')}-${$t(
						'friendInvitation.app_enter_image'
					)}:`
				"
				:show-message="true"
				prop="enterPictureVi"
			>
				<UploadItem
					ref="enterPictureVi"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.enterPictureVi"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'enterPictureVi')
					"
					@deleteUpoladItem="handleDeleteUpload('enterPictureVi')"
					@upoladItemDefeat="handleUploadDefeat('enterPictureVi')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('vi_VN')"
				:label="`${$t('operation.activity_list.app_main_vietnamese')}:`"
				:show-message="true"
				prop="masterPictureVi"
			>
				<UploadItem
					ref="masterPictureVi"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.masterPictureVi"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'masterPictureVi')
					"
					@deleteUpoladItem="handleDeleteUpload('masterPictureVi')"
					@upoladItemDefeat="handleUploadDefeat('masterPictureVi')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('vi_VN')"
				:label="
					`${$t('operation.activity_list.app_share_vietnamese')}:`
				"
				:show-message="true"
				prop="sharePictureVi"
			>
				<UploadItem
					ref="sharePictureVi"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.sharePictureVi"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'sharePictureVi')
					"
					@deleteUpoladItem="handleDeleteUpload('sharePictureVi')"
					@upoladItemDefeat="handleUploadDefeat('sharePictureVi')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-divider></el-divider>
			<h4 class="type-name">PC</h4>
			<el-form-item
				v-if="languages.includes('zh_CN')"
				:label="
					`${$t('common.zh')}-${$t(
						'friendInvitation.pc_enter_image'
					)}:`
				"
				:show-message="true"
				prop="pcEnterPictureZh"
			>
				<UploadItem
					ref="pcEnterPictureZh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcEnterPictureZh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcEnterPictureZh')
					"
					@deleteUpoladItem="handleDeleteUpload('pcEnterPictureZh')"
					@upoladItemDefeat="handleUploadDefeat('pcEnterPictureZh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('zh_CN')"
				:label="`${$t('operation.activity_list.pc_main')}:`"
				:show-message="true"
				prop="pcMasterPictureZh"
			>
				<UploadItem
					ref="pcMasterPictureZh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcMasterPictureZh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcMasterPictureZh')
					"
					@deleteUpoladItem="handleDeleteUpload('pcMasterPictureZh')"
					@upoladItemDefeat="handleUploadDefeat('pcMasterPictureZh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('zh_CN')"
				:label="
					`${$t('common.zh')}-${$t(
						'friendInvitation.pc_share_image'
					)}:`
				"
				:show-message="true"
				prop="pcSharePictureZh"
			>
				<UploadItem
					ref="pcSharePictureZh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.pcSharePictureZh"
					:fileSize="fileSize"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcSharePictureZh')
					"
					@deleteUpoladItem="handleDeleteUpload('pcSharePictureZh')"
					@upoladItemDefeat="handleUploadDefeat('pcSharePictureZh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<br />
			<el-form-item
				v-if="languages.includes('en_US')"
				:label="
					`${$t('common.en')}-${$t(
						'friendInvitation.pc_enter_image'
					)}:`
				"
				:show-message="true"
				prop="pcEnterPictureEn"
			>
				<UploadItem
					ref="pcEnterPictureEn"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcEnterPictureEn"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcEnterPictureEn')
					"
					@deleteUpoladItem="handleDeleteUpload('pcEnterPictureEn')"
					@upoladItemDefeat="handleUploadDefeat('pcEnterPictureEn')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('en_US')"
				:label="`${$t('operation.activity_list.pc_main_english')}:`"
				:show-message="true"
				prop="pcMasterPictureEn"
			>
				<UploadItem
					ref="pcMasterPictureEn"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcMasterPictureEn"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcMasterPictureEn')
					"
					@deleteUpoladItem="handleDeleteUpload('pcMasterPictureEn')"
					@upoladItemDefeat="handleUploadDefeat('pcMasterPictureEn')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('en_US')"
				:label="
					`${$t('common.en')}-${$t(
						'friendInvitation.pc_share_image'
					)}:`
				"
				:show-message="true"
				prop="pcSharePictureEn"
			>
				<UploadItem
					ref="pcSharePictureEn"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.pcSharePictureEn"
					:fileSize="fileSize"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcSharePictureEn')
					"
					@deleteUpoladItem="handleDeleteUpload('pcSharePictureEn')"
					@upoladItemDefeat="handleUploadDefeat('pcSharePictureEn')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<br />
			<el-form-item
				v-if="languages.includes('th_TH')"
				:label="
					`${$t('common.th')}-${$t(
						'friendInvitation.pc_enter_image'
					)}:`
				"
				:show-message="true"
				prop="pcEnterPictureTh"
			>
				<UploadItem
					ref="pcEnterPictureTh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcEnterPictureTh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcEnterPictureTh')
					"
					@deleteUpoladItem="handleDeleteUpload('pcEnterPictureTh')"
					@upoladItemDefeat="handleUploadDefeat('pcEnterPictureTh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('th_TH')"
				:label="`${$t('operation.activity_list.pc_main_thai')}:`"
				:show-message="true"
				prop="pcMasterPictureTh"
			>
				<UploadItem
					ref="pcMasterPictureTh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcMasterPictureTh"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcMasterPictureTh')
					"
					@deleteUpoladItem="handleDeleteUpload('pcMasterPictureTh')"
					@upoladItemDefeat="handleUploadDefeat('pcMasterPictureTh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('th_TH')"
				:label="
					`${$t('common.th')}-${$t(
						'friendInvitation.pc_share_image'
					)}:`
				"
				:show-message="true"
				prop="pcSharePictureTh"
			>
				<UploadItem
					ref="pcSharePictureTh"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.pcSharePictureTh"
					:fileSize="fileSize"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcSharePictureTh')
					"
					@deleteUpoladItem="handleDeleteUpload('pcSharePictureTh')"
					@upoladItemDefeat="handleUploadDefeat('pcSharePictureTh')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<br />
			<el-form-item
				v-if="languages.includes('vi_VN')"
				:label="
					`${$t('common.vn')}-${$t(
						'friendInvitation.pc_enter_image'
					)}:`
				"
				:show-message="true"
				prop="pcEnterPictureVi"
			>
				<UploadItem
					ref="pcEnterPictureVi"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcEnterPictureVi"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcEnterPictureVi')
					"
					@deleteUpoladItem="handleDeleteUpload('pcEnterPictureVi')"
					@upoladItemDefeat="handleUploadDefeat('pcEnterPictureVi')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('vi_VN')"
				:label="`${$t('operation.activity_list.pc_main_vietnamese')}:`"
				:show-message="true"
				prop="pcMasterPictureVi"
			>
				<UploadItem
					ref="pcMasterPictureVi"
					:upload-file-type="'image'"
					:platform="'PC'"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					:fileSize="fileSize"
					:img-url="queryData.pcMasterPictureVi"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcMasterPictureVi')
					"
					@deleteUpoladItem="handleDeleteUpload('pcMasterPictureVi')"
					@upoladItemDefeat="handleUploadDefeat('pcMasterPictureVi')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
			<el-form-item
				v-if="languages.includes('vi_VN')"
				:label="
					`${$t('common.vn')}-${$t(
						'friendInvitation.pc_share_image'
					)}:`
				"
				:show-message="true"
				prop="pcSharePictureVi"
			>
				<UploadItem
					ref="pcSharePictureVi"
					:upload-file-type="'image'"
					:platform="'PC'"
					:img-url="queryData.pcSharePictureVi"
					:fileSize="fileSize"
					:disabled="!editVisibleChlLid"
					:uploadAPI="uploadAPI"
					@startUpoladItem="handleStartUpload"
					@upoladItemSucess="
						handleUploadSucess($event, 'pcSharePictureVi')
					"
					@deleteUpoladItem="handleDeleteUpload('pcSharePictureVi')"
					@upoladItemDefeat="handleUploadDefeat('pcSharePictureVi')"
				></UploadItem>
				<div class="remakeBox danger">
					{{ $t('agent.rule_other_tip3') }}
				</div>
			</el-form-item>
		</el-form>
	</div>
</template>

<script>
import list from '@/mixins/list'
import UploadItem from '@/components/UploadItem'
export default {
	name: 'FrontEndConfiguration',
	components: {
		UploadItem
	},
	mixins: [list],
	props: {
		editVisible: {
			type: Boolean,
			default: () => false
		},
		merchantInfoObj: {
			type: Object,
			default: () => {}
		}
	},
	data() {
		return {
			editVisibleChlLid: false,
			activeImg: null,
			languages: [],
			queryData: {
				enterPictureZh: '',
				enterPictureEn: '',
				enterPictureTh: '',
				enterPictureVi: '',
				masterPictureZh: '',
				masterPictureEn: '',
				masterPictureTh: '',
				masterPictureVi: '',
				sharePictureZh: '',
				sharePictureEn: '',
				sharePictureTh: '',
				sharePictureVi: '',
				pcEnterPictureZh: '',
				pcEnterPictureEn: '',
				pcEnterPictureTh: '',
				pcEnterPictureVi: '',
				pcMasterPictureZh: '',
				pcMasterPictureEn: '',
				pcMasterPictureTh: '',
				pcMasterPictureVi: '',
				pcSharePictureZh: '',
				pcSharePictureEn: '',
				pcSharePictureTh: '',
				pcSharePictureVi: ''
			}
		}
	},
	computed: {
		uploadAPI() {
			return this.$api.imageUpload
		},
		fileSize() {
			return 5 * 1024 * 1024
		},
		rules() {
			return {
				enterPictureZh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				enterPictureTh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				enterPictureVi: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				enterPictureEn: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				masterPictureZh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				masterPictureEn: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				masterPictureTh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				masterPictureVi: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				sharePictureZh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				sharePictureEn: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				sharePictureTh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				sharePictureVi: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcEnterPictureZh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcEnterPictureEn: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcEnterPictureTh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcEnterPictureVi: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcMasterPictureZh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcMasterPictureEn: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcMasterPictureTh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcMasterPictureVi: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcSharePictureZh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcSharePictureEn: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcSharePictureTh: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				],
				pcSharePictureVi: [
					{
						required: true,
						message: this.$t('common.please_upload_img'),
						trigger: 'change'
					}
				]
			}
		}
	},
	watch: {
		editVisible: {
			handler(val) {
				this.$nextTick(() => {
					this.editVisibleChlLid = val
				})
			},
			deep: true,
			immediate: true
		},
		merchantInfoObj: {
			handler(newV, oldV) {
				this.languages = newV?.languages?.split(',') || []
			},
			immediate: true
		},
		// 检测前端配置图片传给父级
		queryData: {
			handler(value) {
				this.$nextTick(() => {
					for (const key in value) {
						if (
							this.$refs[key] &&
							(value[key] || this.queryData[key])
						) {
							this.$refs[key].state = 'image'
							this.$refs[key].fileUrl = this.queryData[key]
						}
					}
					// if (this.$refs.masterPictureZh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.masterPictureZh.state = 'image'
					// 		this.$refs.masterPictureZh.fileUrl = this.queryData.masterPictureZh
					// 	})
					// }
					// if (this.$refs.masterPictureEn) {
					// 	this.$nextTick(() => {
					// 		this.$refs.masterPictureEn.state = 'image'
					// 		this.$refs.masterPictureEn.fileUrl = this.queryData.masterPictureEn
					// 	})
					// }
					// if (this.$refs.masterPictureTh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.masterPictureTh.state = 'image'
					// 		this.$refs.masterPictureTh.fileUrl = this.queryData.masterPictureTh
					// 	})
					// }
					// if (this.$refs.masterPictureVi) {
					// 	this.$nextTick(() => {
					// 		this.$refs.masterPictureVi.state = 'image'
					// 		this.$refs.masterPictureVi.fileUrl = this.queryData.masterPictureVi
					// 	})
					// }
					// if (this.$refs.sharePictureZh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.sharePictureZh.state = 'image'
					// 		this.$refs.sharePictureZh.fileUrl = this.queryData.sharePictureZh
					// 	})
					// }
					// if (this.$refs.sharePictureEn) {
					// 	this.$nextTick(() => {
					// 		this.$refs.sharePictureEn.state = 'image'
					// 		this.$refs.sharePictureEn.fileUrl = this.queryData.sharePictureEn
					// 	})
					// }
					// if (this.$refs.sharePictureTh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.sharePictureTh.state = 'image'
					// 		this.$refs.sharePictureTh.fileUrl = this.queryData.sharePictureTh
					// 	})
					// }
					// if (this.$refs.sharePictureVi) {
					// 	this.$nextTick(() => {
					// 		this.$refs.sharePictureVi.state = 'image'
					// 		this.$refs.sharePictureVi.fileUrl = this.queryData.sharePictureVi
					// 	})
					// }
					// if (this.$refs.pcMasterPictureZh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcMasterPictureZh.state = 'image'
					// 		this.$refs.pcMasterPictureZh.fileUrl = this.queryData.pcMasterPictureZh
					// 	})
					// }
					// if (this.$refs.pcMasterPictureEn) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcMasterPictureEn.state = 'image'
					// 		this.$refs.pcMasterPictureEn.fileUrl = this.queryData.pcMasterPictureEn
					// 	})
					// }
					// if (this.$refs.pcMasterPictureTh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcMasterPictureTh.state = 'image'
					// 		this.$refs.pcMasterPictureTh.fileUrl = this.queryData.pcMasterPictureTh
					// 	})
					// }
					// if (this.$refs.pcMasterPictureVi) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcMasterPictureVi.state = 'image'
					// 		this.$refs.pcMasterPictureVi.fileUrl = this.queryData.pcMasterPictureVi
					// 	})
					// }
					// if (this.$refs.pcSharePictureZh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcSharePictureZh.state = 'image'
					// 		this.$refs.pcSharePictureZh.fileUrl = this.queryData.pcSharePictureZh
					// 	})
					// }
					// if (this.$refs.pcSharePictureEn) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcSharePictureEn.state = 'image'
					// 		this.$refs.pcSharePictureEn.fileUrl = this.queryData.pcSharePictureEn
					// 	})
					// }
					// if (this.$refs.pcSharePictureTh) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcSharePictureTh.state = 'image'
					// 		this.$refs.pcSharePictureTh.fileUrl = this.queryData.pcSharePictureTh
					// 	})
					// }
					// if (this.$refs.pcSharePictureVi) {
					// 	this.$nextTick(() => {
					// 		this.$refs.pcSharePictureVi.state = 'image'
					// 		this.$refs.pcSharePictureVi.fileUrl = this.queryData.pcSharePictureVi
					// 	})
					// }
				})
				const dataValue = {}
				for (const key in this.queryData) {
					dataValue[key] = this.queryData[key]
				}
				// const dataValue = {
				// 	masterPictureZh: this.queryData.masterPictureZh,
				// 	masterPictureEn: this.queryData.masterPictureEn,
				// 	masterPictureTh: this.queryData.masterPictureTh,
				// 	masterPictureVi: this.queryData.masterPictureVi,
				// 	sharePictureZh: this.queryData.sharePictureZh,
				// 	sharePictureEn: this.queryData.sharePictureEn,
				// 	sharePictureTh: this.queryData.sharePictureTh,
				// 	sharePictureVi: this.queryData.sharePictureVi,
				// 	pcMasterPictureZh: this.queryData.pcMasterPictureZh,
				// 	pcMasterPictureEn: this.queryData.pcMasterPictureEn,
				// 	pcMasterPictureTh: this.queryData.pcMasterPictureTh,
				// 	pcMasterPictureVi: this.queryData.pcMasterPictureVi,
				// 	pcSharePictureZh: this.queryData.pcSharePictureZh,
				// 	pcSharePictureEn: this.queryData.pcSharePictureEn,
				// 	pcSharePictureTh: this.queryData.pcSharePictureTh,
				// 	pcSharePictureVi: this.queryData.pcSharePictureVi
				// }
				this.$emit('handleFrontVal', dataValue)
			},
			// immediate: true,
			deep: true
		}
	},
	methods: {
		checkImg(img, i) {
			this.activeImg = img
			this.queryData.listPictureIcon = img
		},
		handleStartUpload() {
			this.$message.info(this.$t('common.upload_start'))
		},
		handleUploadSucess({ file }, property) {
			this.queryData[property] = file.imgUrl
		},
		handleUploadDefeat(property) {
			this.queryData[property] = ''
			this.$message.error(this.$t('common.upload_fail'))
		},
		handleDeleteUpload(property) {
			this.queryData[property] = ''
			this.$message.warning(this.$t('common.upload_del'))
		}
	}
}
</script>

<style lang="scss" scoped>
.type-name {
	border-left: 6px solid #2a2727;
}
</style>
